import 'package:flutter/material.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/widgets.dart';

class OrderDemoWidget extends StatelessWidget {
  const OrderDemoWidget({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Colors.amber,
        title: const Text('案例-商品订单信息'),
      ),
      body: Center(
        child: Container(
          color: Colors.white,
          padding: const EdgeInsets.all(10),
          child: Column(
            mainAxisAlignment: MainAxisAlignment.start,
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Row(
                // 时间和状态
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  const Text('商品名称：'),
                  const Text('待发货', style: TextStyle(color: Colors.orange)),
                ],
              ),
              Row(
                // 图片 标题 和价格等
                children: [
                  Image.network(
                    'https://yanxuan-item.nosdn.127.net/a09de222ed32efa8ffe359b1d5780574.jpg',
                    width: 100,
                    height: 100,
                    fit: BoxFit.cover,
                  ),
                  Expanded(
                    child: Padding(
                      padding: const EdgeInsets.only(
                        left: 10,
                        right: 10,
                        top: 5,
                        bottom: 5,
                      ),
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Row(
                            mainAxisAlignment: MainAxisAlignment.spaceBetween,
                            children: [
                              Expanded(child: Text('茶水分离杯耐热隔热玻璃杯茶水分离杯耐热隔热玻璃杯')),
                              Text('x 2'),
                            ],
                          ), // 名称和个数
                          Padding(
                            padding: const EdgeInsets.only(top: 5),
                            child: Container(
                              padding: const EdgeInsets.only(top: 3, bottom: 3),
                              decoration: BoxDecoration(
                                color: const Color.fromARGB(255, 249, 247, 247),
                                borderRadius: BorderRadius.circular(10),
                              ),
                              child: Text(
                                "规格: 白色240ml",
                                style: const TextStyle(color: Colors.grey),
                              ),
                            ),
                          ), // 规格
                          Padding(
                            padding: const EdgeInsets.only(top: 5),
                            child: Text('\$25'),
                          ),
                        ],
                      ),
                    ),
                  ),
                ],
              ),
              Padding(
                padding: const EdgeInsets.only(left: 10, right: 10, top: 10),
                child: Container(
                  alignment: Alignment.centerRight,
                  child: const Text("合计: \$259"),
                ),
              ),
              Padding(
                padding: const EdgeInsets.only(left: 10, right: 10, top: 10),
                child: Container(
                  alignment: Alignment.centerRight,
                  child: Container(
                    padding: const EdgeInsets.all(5),
                    decoration: BoxDecoration(
                      color: const Color.fromARGB(255, 255, 255, 255),
                      border: Border.all(color: Colors.black),
                    ),
                    child: const Text("再次购买"),
                  ),
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}
